import React, { useEffect, useState } from "react";
import { Space, Button, Modal, Toast, Avatar, Grid,  } from "antd-mobile"
import {
  API,
  REDIRECT_COVER,
  REDIRECT_TITLE,
  REDIRECT_DESC,
  BASE_PATH,
} from "@/config";
import { useRouter } from "next/router";
import { usePathname } from "next/navigation";
import { useToolbar } from "./useToolbar";

const pageName = "toolbar";
const klassName = pageName.replace(/\./g, '-');

export default function Toolbar({user}) {
  const [visible, setVisible] = useState(undefined);
  const [loading, setLoading] = useState(undefined);
  const [env, setENV] = useState(undefined);
  const router = useRouter();
  const pathname = usePathname();
  const { rule,prize } = useToolbar()
  

  useEffect(() => {
    (async () => {
      const seen = sessionStorage.getItem(`seen`);
      if (!seen) {
        rule();
        sessionStorage.setItem(`seen`, `1`)
      }
    })()
  }, [])

  // useEffect(() => {
  //   if (env !== `mini`) return;
  //   // 处理小程序通讯的分享
  //   const data = {
  //     title: REDIRECT_TITLE, // 分享标题
  //     path: REDIRECT_WX_URL,
  //     imageUrl: REDIRECT_WX_COVER
  //   }
  //   wx.miniProgram.postMessage({data})
  // }, [env])

 


  return (
    <div className={`cp-${klassName}`}>
      <div className="inner">
        {/*{*/}
        {/*  [`/rank`, `/tool`].includes(pathname) &&*/}
        {/*  <Button className="back-btn" onClick={e => Router.back()} fill="none">*/}
        {/*    <LeftOutline color="#333" />*/}
        {/*  </Button>*/}
        {/*}*/}

        <Space direction="vertical" size={[20, 20]} className="btn-group">
          <div key={1} className="side-btn" onClick={rule}>
            活<br />
            动<br />
            规<br />
            则
          </div>

          <div key={3} className="side-btn" onClick={e => prize()}>
            我<br />
            的<br />
            奖<br />
            品
          </div>


        </Space>

      </div>

    </div>
  )
}